<extend name="Index/index" />

<block name="link">
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
    <style>
        body{font-family: /*"SofiaProLight",*/ Arial, "microsoft yahei", "helvetica neue", sans-serif;font-size: 12px;line-height: 1.5em;color: #d2d2d2;background: #111;background: #111 url(http://cdn.maxjia.com/image/website/bet/body_bg_03.jpg) no-repeat top;background-size: cover;background-attachment: fixed;}
    </style>
</block>
<block name="main">
    <div id="main-wrap" class="global-container">
    <center>
    <div style="margin-top:80px;"></div>
    <div style="background-image: url(http://img.t.sinajs.cn/t5/skin/public/profile_cover/043.jpg);width: 100%;height: 300px;background-position: bottom center;background-repeat: no-repeat;}">
        <div>
            <div class="bg-wrap"></div>
            <div class="avator-wrap">
                <div class="img-box" id="right_icon" style="width:108px;height:108px;border-radius:50%;background-color: #ccc;">
                    <if condition="$data['icon'] eq '' ">
                    <img src="__PUBLIC__/images/home_person/default_icon.jpg" style="width: 100px;height: 100px;border-radius: 50%;">
                    <else />
                    <img src="<{$iconpath}><{$data['icon']}>" style="width: 100px;height: 100px;border-radius:50%;margin-top:4px;">
                    </if>
                </div>
                <div class="user-name"></div>
            </div>
            <div class="account-info-wrap">
                <div style="margin-top:20px;"></div>
                    <h3 style="color:#000;"><{$data['nickname']}></h3>
                    <div style="margin-top:13px;"></div>
                    <span style="display:none;" id="Hidden"><{$data['u_id']}></span>
                    <button class='btn btn-info myMark'><{$mark}></button>&nbsp;&nbsp;&nbsp;&nbsp;
                    <button class='btn btn-success' data-toggle="modal" data-target="#myModal"> 留言 </button>
                    <div style="margin-top:73px;"></div>
                    <h4><span style="margin-left:20px;">邮箱:<{$data['email']}></span><span style="margin-left:20px;">手机号:<{$data['phone']}></span><span style="margin-left:20px;">生日:<{$data['birthday']}></span></h4>
            </div>
        </div>
    </div>
    </center>
    <div style="margin-top:153px;"></div>
    <!-- Modal -->
        <div class="modal fade " id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="position: fixed; z-index: 9999; top: 180px; left: 15px;">
            <div class="modal-dialog">
                <center>
                    <div class="modal-content" style="background-image: url(http://cdn.dota2.com.cn/apps/dota2/images/store/bg_modal.jpg);width: 458px;height: 216px;">
                        <div id="CartConfirmModalSuccess" style="display: block;">
                            <h2 style="margin: 0;padding: 36px 0 12px 0;font-size: 20px;font-weight: normal;color: #c6c6c6;">留言板</h2><br>
                            <textarea cols="30" rows="2" id="myText"></textarea><br><br><br>
                            <button class="btn btn-info myInfo" data-dismiss="modal">确认</button>
                        </div>
                    </div>
                </center>
            </div>
        </div>
    <script>
        $('.myMark').click(function(){
            if($(this).html() == '取消关注'){
                $(this).html('<b>+</b> 关注');
            }else{
                $(this).html('取消关注');
            }
            var uid = $(this).prev().html();
            $.ajax({
                type: 'post',
                url: "<{:U('Home/User/concem')}>",
                data: 'uid='+uid
            });
        });

        $('.myInfo').click(function(){
            var val = $("#myText").val();
            var uid = $("#Hidden").html();
            $.ajax({
                type: 'post',
                url: "<{:U('Home/User/addMessage')}>",
                data: 'val='+val+'&uid='+uid
            });
        });
    </script>
</block>